{template 'common/header'}
{php echo $this -> set_tabbar($action, 6);}
<style>
    .template-style{display:block;}
    .template-style li{float:left; width:180px; margin:0 2px 10px 2px;}
    .template-style .template-style-pic .title{position:absolute; z-index:100; top:0; width:100%; height:25px; line-height:25px; filter:Alpha(opacity=70);background:#000;background:rgba(0, 0, 0, 0.7); color:#FFF; overflow:hidden;}
    .title .icon-remove{position:absolute; right:0; background:#000; border-left:1px #333 solid; height:25px;line-height:26px;width:20px;text-align:center;cursor:pointer; text-decoration:none;}
    .title .pull-left{margin-left:5px;}
    .template-style .template-style-pic img{width:174px; max-width:174px; height:270px;}
    .template-style .template-style-pic{border:3px #EEE solid;position:relative;overflow:hidden;}
    .template-style .template-style-pic .icon-ok{display:none;}
    .template-style .on.template-style-pic{border:3px #009CD6 solid;}
    .template-style .on.template-style-pic .icon-ok{display:inline-block;position: absolute;bottom:0;right:0;color:#FFF;background:#009CD6;padding:5px;font-size:14px;}
    .template-style .template-style-button{height:50px; line-height:25px;}
    .template{padding:15px;}
    .template li{margin-right:10px;}
</style>
<div class="main">
    <div class="template form-horizontal">
        <div class="alert alert-info">请选择会员卡风格</div>
        <ul class="unstyled template-style clearfix" style="padding-left: 0px;">
            {loop $templates $item}
            <li>
                <div class="template-style-pic {if $templatename == $item}on{/if}"> <!--设为默认风格时class中加on-->
                    <div class="title"><span class="pull-left">{$item}</span></div>
                    <img src="../addons/weisrc_icard/template/mobile/{$item}/preview.jpg" />
                    <span class="icon-ok"></span>
                </div>
                <div class="template-style-button">
                    <a href="{php echo $this->createWebUrl('template', array('templatename' => $item));}" class="btn btn-mini">设为默认</a>
                </div>
            </li>
            {/loop}
        </ul>
    </div>
</div>
<script type="text/javascript">
    <!--
    function ajaxpreview(styleid) {
        var modalobj = $('#modal-preview');
        if(modalobj.length == 0) {
            $(document.body).append('<div id="modal-preview" class="modal hide fade" tabindex="-1" role="dialog" aria-hidden="true" style="position:absolute;top:5%;"></div>');
            var modalobj = $('#modal-preview');
        }
        html = '<iframe width="100%" scrolling="yes" height="100%" frameborder="0" src="{php echo create_url('site/preview')}&styleid='+styleid+'" id="preview" name="preview" style="width: 320px; overflow: visible; height: 480px;"></iframe><div class="modal-footer"><a href="{$_W['siteroot']}{php echo create_url('mobile/channel', array('name' => 'index', 'weid' => $_W['uniacid']))}&styleid='+styleid+'" target="preview" class="btn">首页</a><a href="{$_W['siteroot']}{php echo create_url('mobile/channel', array('name' => 'home', 'weid' => $_W['uniacid']))}" target="preview" class="btn">个人中心</a><a href="#" class="btn" data-dismiss="modal" aria-hidden="true">关闭</a></div>';
        modalobj.html(html);
        modalobj.css({'width' : 320, 'marginLeft' : 0 - 320 / 2});
        modalobj.css({'height' : 480});
        modalobj.on('hidden', function(){modalobj.remove();});
        return modalobj.modal({'show' : true});
    }
    //-->
</script>
{template 'common/footer'}


